<template>
  <div class="search-item-tab">
    <div class="search-item-tab__title">
      {{ dataItem.navRouter }}
    </div>
    <div class="search-item-tab__content">
      <search-item class="search-item" v-for="resItem in dataItem.searchList" :key="resItem.id" :data-item="resItem" :highlight="highlight"  @openPage="$emit('openPage', $event)"></search-item>
    </div>
  </div>
</template>
<script>
import SearchItem from './SearchItem.vue'
export default {
  components: {
    SearchItem
  },
  props: {
    highlight: {
      type: Boolean,
      default: true
    },
    dataItem: {
      type: Object,
      default: () => {
        return {}
      }
    }
  },
  data() {
    return {

    }
  }
}
</script>
<style scoped>
.search-item-tab{
  padding:5px 0px 15px 0px;
}
.search-item-tab__title {
  display: flex;
  font-size: 15px;
  /* color: #333; */
  color:#10914f;
  padding-bottom: 8px;
  border-bottom: 1px solid #aaa;
}
.search-item-tab__content{
  display: flex;
  padding: 10px 20px;
  flex-direction: column;
  align-items: left;
  text-align: left;
}
.search-item{
  font-size: 14px;
  padding: 5px 0px;
}
</style>